<!DOCTYPE html>
<html lang="en">
<head>
    <!--
    @Author 硕鼠
    @Date 2020/4/18 19:55
    @Version 1.0
    @Description 文件说明
  -->
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.4.1.min.js"></script>
    <script>
        $(function () {
            $('#btn1').click(function () {
                $('#a4').siblings().each(function () { //返回被选所有的所有同胞元素
                    console.log($(this).html());
                });
            });
            $('#btn2').click(function () {
                $('#a4').next().each(function () { //返回被选所有的下一个同胞元素A5
                    console.log($(this).html());
                });
            });
            $('#btn3').click(function () {
                $('#a4').nextUntil('#a8').each(function () { //介于两个给定元素之间的每个元素A5,A6,A7
                    console.log($(this).html());
                });
            });
        });
    </script>
</head>
<body>
    <div>
        <ul>
            <li>A1</li>
            <li>A2</li>
            <li>A3</li>
            <li id="a4">A4</li>
            <li>A5</li>
            <li>A6</li>
            <li>A7</li>
            <li id="a8">A8</li>
        </ul>
    </div>
    <div id="result">

    </div>
    <div>
        <input type="button" value="A4所有同胞" id="btn1">
        <input type="button" value="A4下一级同胞" id="btn2">
        <input type="button" value="A4-A8之间的所有同胞元素" id="btn3">
    </div>
</body>
</html>